.card{
	@include flex();
	padding: 20rpx;
	margin: 20rpx;
	border-radius: 10rpx;
	box-shadow: 0 0 10px 2rpx rgba(0,0,0,.1);
	.card-base-img{
		width: 120rpx;
		height: 120rpx;
		border-radius: 10rpx;
		flex-shrink: 0;
		image{
			width: 100%;
			height: 100%;
		}
	}
	// 基本内容区域
	.card-base-content{
		@include flex(space-between,column);
		padding: 20rpx;
		width: 100%;
		.base-content-title{
			@include flex();
			align-items: flex-start;
			font-weight: 400;
			line-height: 1.2;
			width: 100%;
			text{
				overflow: hidden;
				text-overflow: ellipsis;
				display: -webkit-box;
				-webkit-line-clamp: 2;
				-webkit-box-orient: vertical;
			}
		}
		
	}
	// 底下共同区域
	.content-desc{
		@include flex();
		font-size: 24rpx;
		width: 100%;
		margin-top: 20rpx;
		.article-type{
			padding: 0 10rpx;
			margin-right: 10rpx;
			border-radius: 30rpx;
			border: 1px solid $base-color;
		}
		.browse-number{
			color: #999999;
			line-height: 1.5;
		}
	}
	// 多图和大图的公共样式部分
	.list-card-top,.list-card-middle,.list-card-bottom{
		@include flex();
		width: 100%;
	}
	text{
		font-size: 28rpx;
		color: #333;
	}
	/*多图处理*/
	&.mode-column{
		flex-direction: column;
		.list-card-middle{
			margin: 20rpx 0;
			.image-container{
				width: 32%;
				border-radius: 10px;
				height: 140rpx;
				overflow: hidden;
				image{
					width: 100%;
					height: 100%;
				}
			}
		}
	}
	/*大图处理*/
	&.mode-image{
		flex-direction: column;
		.image-container{
			width: 100%;
			height: 200rpx;
			image{
				width: 100%;
				height: 100%;
			}
		}
		.list-card-middle{
			margin-top: 10rpx;
		}
	}
}
